<template>
  <div class="app-container app-container-next">
    <el-card class="box-card" shadow="false">
      <div slot="header" class="clearfix">
        <router-link :to="{name: 'app-private'}">
          <el-button plain icon="el-icon-back" size="small" :round="true">
            返回
          </el-button>
        </router-link>
      </div>
      <el-row>
        <el-col :span="18">
          <el-form ref="siteForm" :model="appPrivate" :rules="rules" label-width="120px">
            <h4>应用详情</h4>
            <el-form-item label="应用名称" prop="appName">
              <el-input v-model="appPrivate.appName" placeholder="请输入应用名称" style="width: 400px"/>
            </el-form-item>
            <el-form-item label="开发者邮箱" prop="developerEmail">
              <el-input v-model="appPrivate.developerEmail" placeholder="请输入开发者邮箱" style="width: 400px"/>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="handleSubmit('siteForm')" :loading="submitLoading">保存</el-button>
              <el-button @click="handleReset('siteForm')">取消</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
import { saveAppPrivate } from '@/api/app-market';
export default {
    name: 'app-private-add',
    components: {},
    data () {
        return {
            appPrivate: {
                appName: '',
                developerEmail: ''
            },
            rules: {
                appName: [
                    { required: true, message: '请输入应用名称', trigger: 'blur' }
                ],
                developerEmail: [
                    {required: true, message: '请输入开发者邮箱', trigger: 'blur'},
                    {type: 'email', message: '邮箱格式不正确', trigger: 'blur'}
                ]
            },
            submitLoading: false
        };
    },
    methods: {
        handleResponse (response, file, fileList) {
            return response;
        },
        handleSubmit (name) {
            this.$refs[name].validate(valid => {
                if (valid) {
                    this.submitLoading = true;
                    // console.log(this.appPrivate);
                    this.appPrivate.siteId = this.siteId;
                    saveAppPrivate(this.appPrivate).then(res => {
                        if (res.code === '200') {
                            this.submitLoading = false;
                            this.$message.success('新增成功');
                            this.$router.push({ name: 'app-private' });
                        }
                    }).catch(() => {
                        this.submitLoading = false;
                    });
                }
            });
        },
        handleReset (name) {
            this.$router.push({ name: 'app-private' });
        }
    },
    computed: {
        siteId () {
            return this.$store.state.user.siteId;
        }
    }
};

</script>

<style scoped>

</style>
